import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

import '../controllers/update_pwd_controller.dart';

class UpdatePwdView extends GetView<UpdatePwdController> {
  const UpdatePwdView({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: const Color(0xFFEDF3FA),
      appBar: AppBar(
        title: Text(
          '修改密码',
          style: TextStyle(
            fontSize: 32.sp,
            fontFamily: 'Source Han Sans CN',
            color: const Color(0xFF333333),
          ),
        ),
        backgroundColor: const Color(0xFFEDF3FA),
        elevation: 0,
        centerTitle: true,
        leading: IconButton(
          icon: Icon(
            Icons.arrow_back_ios,
            color: const Color(0xFF333333),
            size: 40.sp,
          ),
          onPressed: () => Get.back(),
        ),
      ),
      body: GestureDetector(
        onTap: () {
          // 点击空白处隐藏键盘
          FocusScope.of(context).unfocus();
        },
        child: _UpdatePasswordForm(),
      ),
    );
  }
}

class _UpdatePasswordForm extends GetView<UpdatePwdController> {
  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.symmetric(horizontal: 30.w),
      child: Column(
        children: [
          SizedBox(height: 100.h),
          // 原密码输入框
          Container(
            width: 690.w,
            height: 110.h,
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.circular(20.r),
            ),
            child: Row(
              children: [
                SizedBox(width: 30.w),
                Text(
                  '原密码',
                  style: TextStyle(
                    fontSize: 28.sp,
                    fontFamily: 'Source Han Sans',
                    color: const Color(0xFF333333),
                    height: 1.0,
                  ),
                ),
                SizedBox(width: 60.w),
                Expanded(
                  child: Obx(
                    () => TextField(
                      controller: controller.oldPasswordController,
                      obscureText: !controller.isOldPasswordVisible,
                      decoration: InputDecoration(
                        hintText: '请输入原密码',
                        hintStyle: TextStyle(
                          fontSize: 28.sp,
                          fontFamily: 'Source Han Sans CN',
                          color: const Color(0xFF999999),
                          height: 1.0,
                        ),
                        border: InputBorder.none,
                        contentPadding: EdgeInsets.zero,
                      ),
                      style: TextStyle(
                        fontSize: 28.sp,
                        fontFamily: 'Source Han Sans CN',
                        color: const Color(0xFF333333),
                      ),
                    ),
                  ),
                ),
                GestureDetector(
                  onTap: controller.toggleOldPasswordVisibility,
                  child: Padding(
                    padding: EdgeInsets.only(right: 30.w),
                    child: Obx(
                      () =>
                          controller.isOldPasswordVisible
                              ? Image.asset(
                                'assets/images/eye_open_icon.png',
                                width: 40.w,
                                height: 40.h,
                              )
                              : Image.asset(
                                'assets/images/eye_close_icon.png',
                                width: 40.w,
                                height: 40.h,
                              ),
                    ),
                  ),
                ),
              ],
            ),
          ),
          SizedBox(height: 41.h),
          // 新密码输入框
          Container(
            width: 690.w,
            height: 110.h,
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.circular(20.r),
            ),
            child: Row(
              children: [
                SizedBox(width: 30.w),
                Text(
                  '新密码',
                  style: TextStyle(
                    fontSize: 28.sp,
                    fontFamily: 'Source Han Sans',
                    color: const Color(0xFF333333),
                    height: 1.0,
                  ),
                ),
                SizedBox(width: 60.w),
                Expanded(
                  child: Obx(
                    () => TextField(
                      controller: controller.newPasswordController,
                      obscureText: !controller.isNewPasswordVisible,
                      decoration: InputDecoration(
                        hintText: '请输入新密码',
                        hintStyle: TextStyle(
                          fontSize: 28.sp,
                          fontFamily: 'Source Han Sans CN',
                          color: const Color(0xFF999999),
                          height: 1.0,
                        ),
                        border: InputBorder.none,
                        contentPadding: EdgeInsets.zero,
                      ),
                      style: TextStyle(
                        fontSize: 28.sp,
                        fontFamily: 'Source Han Sans CN',
                        color: const Color(0xFF333333),
                      ),
                    ),
                  ),
                ),
                GestureDetector(
                  onTap: controller.toggleNewPasswordVisibility,
                  child: Padding(
                    padding: EdgeInsets.only(right: 30.w),
                    child: Obx(
                      () =>
                          controller.isNewPasswordVisible
                              ? Image.asset(
                                'assets/images/eye_open_icon.png',
                                width: 40.w,
                                height: 40.h,
                              )
                              : Image.asset(
                                'assets/images/eye_close_icon.png',
                                width: 40.w,
                                height: 40.h,
                              ),
                    ),
                  ),
                ),
              ],
            ),
          ),
          SizedBox(height: 41.h),
          // 确认密码输入框
          Container(
            width: 690.w,
            height: 110.h,
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.circular(20.r),
            ),
            child: Row(
              children: [
                SizedBox(width: 30.w),
                Text(
                  '确认密码',
                  style: TextStyle(
                    fontSize: 28.sp,
                    fontFamily: 'Source Han Sans',
                    color: const Color(0xFF333333),
                    height: 1.0,
                  ),
                ),
                SizedBox(width: 32.w),
                Expanded(
                  child: Obx(
                    () => TextField(
                      controller: controller.confirmPasswordController,
                      obscureText: !controller.isConfirmPasswordVisible,
                      decoration: InputDecoration(
                        hintText: '请再次输入新密码',
                        hintStyle: TextStyle(
                          fontSize: 28.sp,
                          fontFamily: 'Source Han Sans CN',
                          color: const Color(0xFF999999),
                          height: 1.0,
                        ),
                        border: InputBorder.none,
                        contentPadding: EdgeInsets.zero,
                      ),
                      style: TextStyle(
                        fontSize: 28.sp,
                        fontFamily: 'Source Han Sans CN',
                        color: const Color(0xFF333333),
                      ),
                    ),
                  ),
                ),
                GestureDetector(
                  onTap: controller.toggleConfirmPasswordVisibility,
                  child: Padding(
                    padding: EdgeInsets.only(right: 30.w),
                    child: Obx(
                      () =>
                          controller.isConfirmPasswordVisible
                              ? Image.asset(
                                'assets/images/eye_open_icon.png',
                                width: 40.w,
                                height: 40.h,
                              )
                              : Image.asset(
                                'assets/images/eye_close_icon.png',
                                width: 40.w,
                                height: 40.h,
                              ),
                    ),
                  ),
                ),
              ],
            ),
          ),
          SizedBox(height: 30.h),
          // 密码规则说明
          Container(
            width: 690.w,
            padding: EdgeInsets.all(24.w),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  '密码规则：',
                  style: TextStyle(
                    fontSize: 26.sp,
                    fontFamily: 'Source Han Sans CN',
                    color: const Color(0xFF333333),
                    fontWeight: FontWeight.w500,
                  ),
                ),
                SizedBox(height: 16.h),
                _buildPasswordRuleItem('1. 数字、大写、小写、特殊字符需包含其中3种'),
                SizedBox(height: 12.h),
                _buildPasswordRuleItem('2. 密码长度不小于8位'),
                SizedBox(height: 12.h),
                _buildPasswordRuleItem('3. 密码内不能出现WASU(大小写任意组合)'),
              ],
            ),
          ),
          const Spacer(),
          // 提交修改按钮
          Obx(
            () => GestureDetector(
              onTap:
                  (controller.isLoading || !controller.canSubmit)
                      ? null
                      : controller.modifyPassword,
              child: Container(
                width: 690.w,
                height: 88.h,
                margin: EdgeInsets.only(bottom: 100.h),
                decoration: BoxDecoration(
                  color:
                      controller.isLoading
                          ? const Color(0xFFE0E0E0)
                          : controller.canSubmit
                          ? const Color(0xFFDEEDFF)
                          : const Color(0xFFF5F5F5),
                  borderRadius: BorderRadius.circular(20.r),
                  border: Border.all(
                    color:
                        controller.isLoading
                            ? const Color(0xFFBDBDBD)
                            : controller.canSubmit
                            ? const Color(0xFF79B4F9)
                            : const Color(0xFFE0E0E0),
                    width: 1.w,
                  ),
                ),
                child: Center(
                  child:
                      controller.isLoading
                          ? SizedBox(
                            width: 20.w,
                            height: 20.h,
                            child: const CircularProgressIndicator(
                              strokeWidth: 2,
                              color: Color(0xFF333333),
                            ),
                          )
                          : Text(
                            '提交修改',
                            style: TextStyle(
                              fontSize: 28.sp,
                              fontFamily: 'Source Han Sans CN',
                              color:
                                  controller.canSubmit
                                      ? const Color(0xFF333333)
                                      : const Color(0xFF999999),
                            ),
                          ),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }

  // 构建密码规则项
  Widget _buildPasswordRuleItem(String text) {
    return Padding(
      padding: EdgeInsets.only(left: 8.w),
      child: Text(
        text,
        style: TextStyle(
          fontSize: 24.sp,
          fontFamily: 'Source Han Sans CN',
          color: const Color(0xFF666666),
          height: 1.5,
        ),
      ),
    );
  }
}
